<template>
  <a-form :model="formState">
    <a-form-item label="用户">
      <a-input v-model:value="formState.ename" placeholder="用户名" />
    </a-form-item>
    <a-form-item label="密码">
      <a-input-password
        v-model:value="formState.password"
        placeholder="密  码"
      />
    </a-form-item>
    <a-form-item>
      <a-button type="primary" @click="submit">Submit</a-button>
    </a-form-item>

    <alert-cpt
      v-show="showAlert"
      :alert-direction="alertDirection"
      :alert-type="alertType"
    />
  </a-form>
</template>
<script lang="ts">
import { computed, defineComponent, reactive, ref, UnwrapRef } from "vue";
// 登录接口数据模型
import { requestLogin } from "../model/login";
import servieApi from "../api/serve/servieApi";
import AlertCpt from "../components/AlertCpt.vue";
import { AlertTypeEnum } from "../model/enumAlert";
import { BBM } from "../model/BBM_info/bbm";
import { Convertor } from "../model/BBM_info/HttpMsgConvertor";
import {
  plainToClass,
  plainToClassFromExist,
  classToPlain,
} from "class-transformer";
import { useStore } from "../store";

export default defineComponent({
  components: {
    AlertCpt,
  },
  setup() {
    const formState: UnwrapRef<requestLogin> = reactive({
      ename: "",
      password: "",
    });
    const formItemLayout = computed(() => {});
    const alertType = ref(AlertTypeEnum.success);
    const alertDirection = ref("");
    const showAlert = ref(false);

    const store = useStore();

    // 登录提交获取token
    const submit = (): void => {
      servieApi.login(formState).then(
        (resolve) => {
          alertType.value = AlertTypeEnum.success;
          alertDirection.value = "登录成功,获取token成功";
          showAlert.value = true;

          // localStorage 保存token
          localStorage.setItem("token ", resolve.data.token);
          console.log(resolve.data.token);
          let token = resolve.data.token;
          servieApi.queryUserByNmae(formState).then(
            (resolve1) => {
              console.log(resolve1.data);
              // TODO :将json对象转换为bbm对象
              // let a = plainToClass(BBM.BBM, resolve1.data);
              let bbm = new BBM.BBM();
              let a = plainToClassFromExist(bbm, resolve1.data);
              let table: BBM.BBM_table | undefined = a.getTable("USER_INFO");
              // console.log(table);
              // console.log(table?.rows);
              // let b = plainToClass(BBM.BBM_table,table);
              // let row0 = b?.getFirstRow();
              // debugger;
              if (table != undefined) {
                let c = Convertor.jsonToTable(table);
                // console.log(c.getFirstRow());
                // console.log(c.getRowValue(0,"ENAME"));
                let ename = c.getRowValue(0, "ENAME");
                let cname = c.getRowValue(0, "CNAME");
                let envType = c.getRowValue(0, "ENV_TYPE");
                let version = c.getRowValue(0, "VERSION");
                let userId = c.getRowValue(0, "USER_ID");
                let map = new Map();
                map.set("ename", ename);
                map.set("cname", cname);
                map.set("envType", envType);
                map.set("version", version);
                map.set("userId", userId);
                map.set("token", token);
                // 用户基本信息存入Store ,同步存入LocalStorage
                console.log(map);
                store.dispatch("changeUser", map);
              }
            },
            (reject1) => {}
          );
        },
        (reject) => {
          alertType.value = AlertTypeEnum.error;
          alertDirection.value = "登录失败,获取token失败" + reject;
          showAlert.value = true;
        }
      );
    };
    return {
      formState,
      submit,
      alertType,
      alertDirection,
      showAlert,
    };
  },
});
</script>

